<!--
 * @Author: ailin
 * @Date: 2022-12-08 17:22:25
 * @LastEditors: ailin
 * @LastEditTime: 2023-09-05 19:17:05
 * @Description: file content
 * @FilePath: /pay_platform/src/views/ule/setPay/validPassword.vue
-->
<template>
  <div class="content">
    <p class="tips">请输入6位数支付密码</p>
    <van-config-provider :theme-vars="themeVars">
      <!-- 密码输入框 -->
      <van-password-input :value="password" length="6" :focused="showKeyboard" @focus="showKeyboard = true" />
      <div class="forget_pwd"><span @click="data.toResetPassword">忘记旧密码？</span></div>
      <!-- 数字键盘 -->
      <van-number-keyboard v-model="password" maxlength="6" :show="showKeyboard" @blur="showKeyboard = false" />
    </van-config-provider>
  </div>
</template>
<script setup>
import { verifyAccountSecurity } from "@/assets/js/api/api.js"
import { encrypted } from "@/assets/js/DES.js"
import { ref, onMounted, reactive, watch } from "vue"
import { loadScript, setAppTitle, delLocalStorage, changeSearch } from "@/assets/js/common.js"
import { showSuccessToast, showToast } from "vant"
import { useRoute, useRouter } from "vue-router"
const route = useRoute()
const router = useRouter()

const password = ref("")
const showKeyboard = ref(true)
const themeVars = reactive({
  passwordInputMargin: "0 22.5px",
  passwordInputRadius: "0",
  borderColor: "#c2c2c2",
  passwordInputHeight: "55px"
})
const data = {
  getPageType: function () {
    let userAgent = navigator.userAgent.toLowerCase(),
      pageType = "H5"
    if (userAgent.match(/MicroMessenger/i) == "micromessenger") {
      //微信环境
      if (/miniprogram/.test(ua)) {
        pageType = "微信小程序"
      } else {
        pageType = "微信H5"
      }
    } else {
      if (userAgent.match(/android|adr/i)) {
        pageType = "Android"
      } else if (userAgent.match(/(iphone|ipod|ipad);?/i)) {
        pageType = "iOS"
      } else {
        //浏览器环境
        pageType = "H5"
      }
    }
    return pageType
  },
  toResetPassword: () => {
    let params = { ...route.query, ...{ status: "r", isOpenNewPay: "1" } }
    router.push(`/setPayNumber${changeSearch(params)}`)
    //神策埋点-忘记密码-点击
    window.uleStatUtil &&
      window.uleStatUtil.sendSensorTrack("btnClick", {
        ule_title: window.document.title,
        button_name: "旧密码-忘记密码",
        platform_type: data.getPageType(),
        key_business_name: ""
      })
  }
}
onMounted(() => {
  // console.log(encrypted("123456+-qwe"))
  // console.log(desDecrypt("Gj6G4YXJZmI%3D"))
  setAppTitle("验证密码")
})
watch(password, (newVal) => {
  if (newVal.length === 6) {
    console.log("==输入完成", newVal)
    verifyAccountSecurity(
      {
        payPwd: encrypted(newVal), // 支付密码
        channel: "h5" // 渠道
      },
      "",
      "jsonCallback"
    ).then((res) => {
      console.log("====密码验证", res)
      if (res.code == "0000") {
        //支付密码验证通过直接调起生物支付开通方法
        loadScript("//i2.ulecdn.com/ulewap/j/cashierDesk/dsbridge.js", (res) => {
          try {
            dsBridge.call("openBiometricPay", function (ret) {
              //0 取消;1指纹失败次数过多;2成功
              console.log("openBiometricPay", ret)
              if (ret == 2) {
                showSuccessToast("开通成功")
                delLocalStorage("dontOpenPay") //清理缓存状态
                setTimeout(() => {
                  dsBridge.call("generalAction", { type: "0", ios_action: "ulePopView", android_action: "ulePopView" })
                }, 2000)
              } else if (ret == 1) {
                if (route.query.isSetting == 1) {
                  showToast("多次验证错误，请稍后再试")
                  setTimeout(() => {
                    dsBridge.call("generalAction", { type: "0", ios_action: "ulePopView", android_action: "ulePopView" })
                  }, 2000)
                  return false
                }
                //开通失败通知收银台页面
                dsBridge.call("generalAction", {
                  type: "6",
                  ios_action: JSON.stringify({
                    functionName: "NotifyTestPay",
                    functionParams: "noOpen"
                  }),
                  android_action: JSON.stringify({
                    functionName: "NotifyTestPay",
                    functionParams: "noOpen"
                  }),
                  needlogin: "false",
                  logTitle: ""
                })
              } else {
                //如果是app的设置页面进入的，验证完密码直接关闭当前webview页面,只有app进入此页面传参数setting=1
                if (route.query.isSetting == 1) {
                  dsBridge.call("generalAction", { type: "0", ios_action: "ulePopView", android_action: "ulePopView" })
                  return false
                }
                //开通失败通知收银台页面
                dsBridge.call("generalAction", {
                  type: "6",
                  ios_action: JSON.stringify({
                    functionName: "NotifyTestPay",
                    functionParams: "noOpen"
                  }),
                  android_action: JSON.stringify({
                    functionName: "NotifyTestPay",
                    functionParams: "noOpen"
                  }),
                  needlogin: "false",
                  logTitle: ""
                })
                dsBridge.call("generalAction", { type: "0", ios_action: "ulePopView", android_action: "ulePopView" })
              }
            })
          } catch (err) {
            console.log(err)
          }
        })
      } else {
        showToast(res.msg)
      }
    })
  }
})
</script>
<style lang="scss" scoped>
.content {
  .tips {
    margin: 82px 0 40px;
    font-size: 28px;
    font-family: PingFangSC-Regular, "PingFang SC";
    text-align: center;
    color: #666;
    font-weight: 400;
    line-height: 40px;
  }
  .forget_pwd {
    display: flex;
    margin-top: 20px;
    flex-direction: row-reverse;
    padding: 0 30px;
    span {
      font-size: 28px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #ee1919;
      line-height: 40px;
    }
  }
}
</style>
